<!DOCTYPE html>
<!--suppress ALL -->
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>
<title>信保通</title>
<!-- HTML5 Shim and Respond.js IE9 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script type="text/javascript" th:src="${urls.getForLookupPath('https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js')}"></script>
<script type="text/javascript" th:src="${urls.getForLookupPath('https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js')}"></script>
      <![endif]-->
<!-- Meta -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no">
<meta name="description" content="Phoenixcoded">
<meta name="keywords"
	content=", Flat ui, Admin , Responsive, Landing, Bootstrap, App, Template, Mobile, iOS, Android, apple, creative app">
<meta name="author" content="Phoenixcoded">
<!-- Favicon icon -->
<link rel="icon" th:href="${urls.getForLookupPath('/assets/images/favicon.ico')}" type="image/x-icon">
<!-- Google font-->
<!-- <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800" rel="stylesheet">-->
<!-- Required Fremwork -->
<link rel="stylesheet" type="text/css" th:href="${urls.getForLookupPath('/bower_components/bootstrap/css/bootstrap.min.css')}">
<!-- themify icon -->
<link rel="stylesheet" type="text/css" th:href="${urls.getForLookupPath('/assets/icon/themify-icons/themify-icons.css')}">
<!-- ico font -->
<link rel="stylesheet" type="text/css" th:href="${urls.getForLookupPath('/assets/icon/icofont/css/icofont.css')}">
<!-- flag icon framework css -->
<!-- <link rel="stylesheet" type="text/css" th:href="${urls.getForLookupPath('/assets/pages/flag-icon/flag-icon.min.css')}"> -->
<!-- Menu-Search css -->
<!-- <link rel="stylesheet" type="text/css" th:href="${urls.getForLookupPath('/assets/pages/menu-search/css/component.css')}"> -->
<!-- Horizontal-Timeline css -->
<!-- <link rel="stylesheet" type="text/css" th:href="${urls.getForLookupPath('/assets/pages/dashboard/horizontal-timeline/css/style.css')}"> -->
<!-- amchart css -->
<!-- <link rel="stylesheet" type="text/css" th:href="${urls.getForLookupPath('/assets/pages/dashboard/amchart/css/amchart.css')}"> -->
<!-- flag icon framework css -->
<!-- <link rel="stylesheet" type="text/css" th:href="${urls.getForLookupPath('/assets/pages/flag-icon/flag-icon.min.css')}"> -->
<!-- Style.css -->
<link rel="stylesheet" type="text/css" th:href="${urls.getForLookupPath('/assets/css/style.css')}">
<!--color css-->
<!-- Date-time picker css -->
<!-- <link rel="stylesheet" type="text/css" th:href="${urls.getForLookupPath('/assets/pages/advance-elements/css/bootstrap-datetimepicker.css')}"> -->
<!-- Date-range picker css  -->
<!-- <link rel="stylesheet" type="text/css" th:href="${urls.getForLookupPath('/bower_components/bootstrap-daterangepicker/css/daterangepicker.css')}" /> -->
<!-- Date-Dropper css -->
<!-- <link rel="stylesheet" type="text/css" th:href="${urls.getForLookupPath('/bower_components/datedropper/css/datedropper.min.css')}" /> -->
<!-- Data Table Css -->
<!-- <link rel="stylesheet" type="text/css" th:href="${urls.getForLookupPath('/bower_components/datatables.net-bs4/css/dataTables.bootstrap4.min.css')}"> -->
<!-- <link rel="stylesheet" type="text/css" th:href="${urls.getForLookupPath('/assets/pages/data-table/css/buttons.dataTables.min.css')}"> -->
<!-- <link rel="stylesheet" type="text/css" th:href="${urls.getForLookupPath('/bower_components/datatables.net-responsive-bs4/css/responsive.bootstrap4.min.css')}"> -->

<!-- <link rel="stylesheet" type="text/css" th:href="${urls.getForLookupPath('/assets/css/linearicons.css')}"> -->
<link rel="stylesheet" type="text/css" th:href="${urls.getForLookupPath('/assets/css/simple-line-icons.css')}">
<!-- <link rel="stylesheet" type="text/css" th:href="${urls.getForLookupPath('/assets/css/ionicons.css')}"> -->
<!-- <link rel="stylesheet" type="text/css" th:href="${urls.getForLookupPath('/assets/css/jquery.mCustomScrollbar.css')}"> -->
<!-- pages -->
<link rel="stylesheet" th:href="${urls.getForLookupPath('/assets/css/element.css')}">
<link rel="stylesheet" th:href="${urls.getForLookupPath('/assets/css/common.css')}">
 
    
<style type="text/css">
    .tdd1{word-wrap:break-word; width:200px; white-space:normal;} 
    .input-new-tag { width:auto;margin-left: 3px;margin-right: 3px;margin-top:4px}
    .input-new-tag .el-input__inner { width:90px; height:32px; line-height:32px; background:transparent;}
    .el-tag { margin-left:5px;}
</style>
</head>

<body>
<!-- Pre-loader start -->
	<div class="theme-loader">
	</div>
	<!-- Pre-loader end -->
	<!-- Menu header start -->
	<div id="pcoded" class="pcoded">
		<div class="pcoded-overlay-box"></div>
		<div class="pcoded-container navbar-wrapper">
            <div id="topBar"></div>
			<div class="pcoded-main-container">
				<div class="pcoded-wrapper">
				    <!-- nav -->
				    <div id="sidebarNavbar"></div>
					<div class="pcoded-content">
						<div class="pcoded-inner-content">
                            <!-- main start -->
                            <div class="main-body" id="mainBody">
                                <div class="page-wrapper">
                                    <div class="page-header">
                                        <div class="page-header-title">
                                            <h4>数据字典</h4>
                                            <span>数据字典......</span>
                                        </div>
                                        <div class="page-header-breadcrumb">
                                            <ul class="breadcrumb-title">
                                                <li class="breadcrumb-item"><a href="../index.html"> <i class="icofont icofont-home"></i>
                                                </a></li>
                                                <li class="breadcrumb-item"><a href="#!">系统设置</a></li>
                                                <li class="breadcrumb-item"><a href="#!">数据字典</a></li>
                                            </ul>
                                        </div>
                                    </div>
                                    <div class="page-body">
                                        <div class="row">
                                            <div class="col-lg-12">
                                                <div class="card table-1-card">
                                                    <div class="card-block">
                                                        <div class="card-header">
                                                            <h5>数据查询</h5>
                                                            <div class="button">
                                                                <button class="btn btn-round btn-success" @click="createDatas('ruleForm')"><i class="icofont icofont-ui-add"></i>新建数据</button>
                                                            </div>
                                                        </div>
                                                        <div class="card-body">
                                                            <div class="dataDicitionary-search">
                                                                <el-form :inline="true" :model="searchForm" ref="searchForm" class="demo-form-inline" style="float:left; width:80%;">
                                                                    <el-form-item label="名称" style="width:58%" prop="select">
                                                                        <el-select multiple filterable v-model="searchForm.select" placeholder="请选择名称" style="width:100%;">
                                                                            <el-option v-for="dataKey in dataKeys" :label="dataKey.label" :value="dataKey.value"></el-option>
                                                                        </el-select>
                                                                    </el-form-item>
                                                                    <el-form-item label="操作人" prop="person">
                                                                        <el-input v-model="searchForm.person" placeholder="请输入操作人"></el-input>
                                                                    </el-form-item>
                                                                </el-form>
                                                                <div class="dataDicitionary-searchBtns">
                                                                    <button type="button" class="btn btn-round btn-success" @click="selectKeysAndUser()"><i class="icofont icofont-ui-search"></i>查询</button>
                                                                    <button type="button" class="btn btn-round btn-warning" @click="resetForm('searchForm')"><i class="icofont icofont icofont-ui-delete"></i>清空</button>
                                                                </div>
                                                            </div>
                                                            <div class="table-responsive">
                                                                <table class="table table-striped table-bordered" id="example-2">
                                                                    <thead>
                                                                        <tr><th>#</th><th>名称</th><th>值</th><th>操作人</th><th>更新时间</th><th>操作</th></tr>
                                                                    </thead>
                                                                    <tbody>
                                                                        <tr v-for="(dataItem,index) in dataList"><td>{{index + 1}}</td><td>{{dataItem.dataKeys}}</td><td class="tdd1">{{dataItem.dataValue}}</td><td>{{dataItem.uploadId}}</td><td>{{dataItem.uploadDate}}</td><td><button type="button" class="tabledit-edit-button btn btn-primary waves-effect waves-light" style="float: none; margin: 5px;" @click="changeItem(index)">修改</button><button type="button" class="tabledit-edit-button btn btn-default waves-effect waves-light" style="float: none; margin: 5px;" @click="deleteItem(index)">删除</button></td></tr>
                                                                    </tbody>
                                                                </table>
                                                            </div>
                                                            <div class="block">
																<el-pagination background layout="prev, pager, next,total" :current-page="currentpage" @current-change="handleCurrentChange" :total="pageBean.totalNumber"></el-pagination>
															</div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!--新建数据-->
                                <el-dialog title="新建数据" :visible.sync="dialogVisible" :close-on-click-modal="false" width="50%" @close="closeDialog('ruleForm')">
                                    <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="120px" class="demo-ruleForm">
                                        <el-form-item label="名称：" prop="selectDataKey">
                                            <el-select filterable style="width:100%;" v-model="ruleForm.selectDataKey" placeholder="请选择名称" clearable>
                                                <el-option v-for="dataKey in dataKeys" :label="dataKey.label" :value="dataKey.value" ></el-option>
                                            </el-select>
                                        </el-form-item>
                                        <el-form-item label="值：" required>
                                        	<div style="border:1px solid #dcdfe6;border-radius:4px; min-height:38px;line-height: 38px;">
		                                        <el-tag :key="tag" v-for="tag in dynamicTags" closable :disable-transitions="false" @close="handleClose(tag)">{{tag}}</el-tag>
												<el-input v-on:blur="lose()" class="input-new-tag" placeholder="请输入值" v-model="inputValue" ref="saveTagInput" size="small" @keyup.enter.native="handleInputConfirm" @blur="handleInputConfirm"></el-input>
												<!-- <el-button v-else class="button-new-tag" size="small" @click="showInput">+ 继续添加</el-button><br/><span id="span1"></span> -->
											</div>
											<span id="span1" style="margin-top:-10px; display:block"></span>
                                        </el-form-item>
                                    </el-form>
                                    <span slot="footer" class="dialog-footer">
                                        <el-button type="primary" @click="saveForm('ruleForm')">保存</el-button>
                                    </span>
                                </el-dialog>
                                <!--查看修改-->
                                <el-dialog :title="viewTitle" :visible.sync="showDialog" :close-on-click-modal="false" width="50%" @close="closeDialog('form')">
                                    <el-form ref="form" :rules="changeRules" :model="form" label-width="130px">
                                        <el-row>
                                            <el-col :span="24">
                                                <el-form-item label="名称">
                                                    <el-select style="width:100%" v-model="form.dataKeys" placeholder="请选择名称" disabled="disabled">
                                                        <el-option v-for="dataKey in dataKeys" :value="dataKey.value" ></el-option>
                                                    </el-select>
                                                </el-form-item>
                                            </el-col>
                                            <el-col :span="24">
                                                <el-form-item label="值" prop="dataValue">
                                                    <el-input v-model="form.dataValue" :disabled="isDisabled"></el-input>
                                                </el-form-item>
                                            </el-col>
                                        </el-row>

                                    </el-form>
                                    <span slot="footer" class="dialog-footer">
                                        <el-button v-if="isDisabled" type="primary" @click="showDialog=false">关闭</el-button>
                                        <el-button v-else type="primary" @click="saveChangeForm('form')">保存</el-button>
                                    </span>
                                </el-dialog>
                            </div>
                            <!-- main end -->
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
    <script type="text/javascript" th:src="${urls.getForLookupPath('/assets/js/bluebird.min.js')}"></script>
	<!-- Older IE warning message -->
	<!-- Warning Section Ends -->
	<!-- Required Jqurey -->
	<script type="text/javascript" th:src="${urls.getForLookupPath('/bower_components/jquery/js/jquery.min.js')}"></script>
	<!-- <script type="text/javascript" th:src="${urls.getForLookupPath('/bower_components/jquery-ui/js/jquery-ui.min.js')}"></script> -->
	<script type="text/javascript" th:src="${urls.getForLookupPath('/bower_components/popper.js/js/popper.min.js')}"></script>
	<script type="text/javascript" th:src="${urls.getForLookupPath('/bower_components/bootstrap/js/bootstrap.min.js')}"></script>
	<!-- jquery slimscroll js -->
	<script type="text/javascript" th:src="${urls.getForLookupPath('/bower_components/jquery-slimscroll/js/jquery.slimscroll.js')}"></script>
	<!-- modernizr js -->
	<script type="text/javascript" th:src="${urls.getForLookupPath('/bower_components/modernizr/js/modernizr.js')}"></script>
	<!-- <script type="text/javascript" th:src="${urls.getForLookupPath('/bower_components/modernizr/js/css-scrollbars.js')}"></script> -->
	<!-- classie js -->
	<!-- <script type="text/javascript" th:src="${urls.getForLookupPath('/bower_components/classie/js/classie.js')}"></script> -->


	<!-- i18next.min.js -->
	<script type="text/javascript" th:src="${urls.getForLookupPath('/bower_components/i18next/js/i18next.min.js')}"></script>
	<script type="text/javascript" th:src="${urls.getForLookupPath('/bower_components/i18next-xhr-backend/js/i18nextXHRBackend.min.js')}"></script>
	<!-- <script type="text/javascript" th:src="${urls.getForLookupPath('/bower_components/i18next-browser-languagedetector/js/i18nextBrowserLanguageDetector.min.js')}"></script> -->
	<script type="text/javascript" th:src="${urls.getForLookupPath('/bower_components/jquery-i18next/js/jquery-i18next.min.js')}"></script>


	<!-- Bootstrap date-time-picker js -->
	<script type="text/javascript" th:src="${urls.getForLookupPath('/assets/pages/advance-elements/moment-with-locales.min.js')}"></script>
	<script type="text/javascript" th:src="${urls.getForLookupPath('/bower_components/bootstrap-datepicker/js/bootstrap-datepicker.min.js')}"></script>
	<script type="text/javascript" th:src="${urls.getForLookupPath('/assets/pages/advance-elements/bootstrap-datetimepicker.min.js')}"></script>
	<!-- Date-range picker js -->
	<script type="text/javascript" th:src="${urls.getForLookupPath('/bower_components/bootstrap-daterangepicker/js/daterangepicker.js')}"></script>
	<!-- Date-dropper js -->
	<script type="text/javascript" th:src="${urls.getForLookupPath('/bower_components/datedropper/js/datedropper.min.js')}"></script>
	<!-- Custom js -->
	<!-- <script type="text/javascript" th:src="${urls.getForLookupPath('/assets/pages/advance-elements/custom-picker.js')}"></script> -->
	<script type="text/javascript" th:src="${urls.getForLookupPath('/assets/js/script.js')}"></script>
	<!-- <script type="text/javascript" th:src="${urls.getForLookupPath('/assets/js/pcoded.min.js')}"></script> -->
	<!-- pcmenu js -->
	<script type="text/javascript" th:src="${urls.getForLookupPath('/assets/js/pcoded.min.js')}"></script>
	<script type="text/javascript" th:src="${urls.getForLookupPath('/assets/js/demo-12.js')}"></script>
	<script type="text/javascript" th:src="${urls.getForLookupPath('/assets/js/jquery.mCustomScrollbar.concat.min.js')}"></script>
	<!-- <script type="text/javascript" th:src="${urls.getForLookupPath('/assets/js/jquery.mousewheel.min.js')}"></script> -->
    <!-- datatables -->
    <script type="text/javascript" th:src="${urls.getForLookupPath('/bower_components/datatable/jquery.dataTables.min.js')}"></script>
    <!-- <script type="text/javascript" th:src="${urls.getForLookupPath('/bower_components/datatable/dataTables.buttons.min.js')}"></script> -->
    <script type="text/javascript" th:src="${urls.getForLookupPath('/bower_components/datatable/jszip.min.js')}"></script>
    <!-- <script type="text/javascript" th:src="${urls.getForLookupPath('/bower_components/datatable/pdfmake.min.js')}"></script>
    <script type="text/javascript" th:src="${urls.getForLookupPath('/bower_components/datatable/vfs_fonts.js')}"></script>
    <script type="text/javascript" th:src="${urls.getForLookupPath('/bower_components/datatable/buttons.html5.min.js')}"></script> -->
    <!-- vue -->
    <script type="text/javascript" th:src="${urls.getForLookupPath('/assets/js/vue/vue.min.js')}"></script>
    <script type="text/javascript" th:src="${urls.getForLookupPath('/assets/js/vue/element.js')}"></script>
	<script type="text/javascript" th:src="${urls.getForLookupPath('/assets/js/pages/systemsetup/dataDictionary.js')}"></script>
	   <!-- pages -->
    <script type="text/javascript" th:src="${urls.getForLookupPath('/assets/js/pages/common.js')}"></script>
	
</body>
</html>
